<template lang="html">
  <div class="container">
      <div class="card" v-for="(item,index) in hotRadioData">
          <div class="card-slider">
              <div class="poster">
                  <img :src="item.url" alt="">
              </div>
          </div>
          <div class="info">
              <div class="name">{{item.title}}</div>
          </div>
      </div>
  </div>
</template>

<script>
export default {
    name:"hotradio",
    data(){
      return{
        hotRadioData:[

        ]
      }
    },
    created(){
        const recommendSeeUrl="http://localhost:8080/static/superHotRadio.json"
        // const recommendSeeUrl=this.HOST+"/v1/restserver/ting?method=baidu.ting.song.getRecommandSongList&song_id=877578&num=5"
        this.$axios.get(recommendSeeUrl)
        .then(res=>{
            // console.log(res.data);
            this.hotRadioData=res.data.recommendRadioData;
        })
        .catch((error) => {
          console.log(error);
        })
    }

}
</script>

<style scoped>
.container .card{
    float: left;
    width: 50%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0 5px 20px;
}
.poster img{
  width:3.7rem;
  height: 2.2rem;
}
</style>
